<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0, user-scalable=no">
		<title></title>
		<style type="text/css">
			html,body{
				margin: 0;
				padding: 0;
				background: #f5f5f5;
				color: #333333;
			}
			label{
				font-size: 3.2vw;
			}
			.main{
				width: 100%;
				display: flex;
				flex-direction: column;
				align-items: center;
			}
			.titTxt{
				width: 100%;
				text-align: center;
				padding: 2.8vw 0;
				background: white;
			}
			.content{
				width: 93%;
				background: white;
				display: flex;
				flex-direction: column;
				align-items: center;
				border-radius: 2vw;
				margin: 3.2vw 0;
			}
			.list{
				width: 93%;
				height: 12vw;
				line-height: 12vw;
				border-bottom: 1px solid #f2f2f2;
			}
			.list label{
				display: inline-block;
				width: 25%;
				font-size: 3.2vw;
			}
			.list input{
				border: none;
			}
			.list input:focus{
				outline:0px;
			}
			.list1{
				width: 93%;
				height: 12vw;
				line-height: 12vw;
				border-bottom: 1px solid #f2f2f2;
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;
			}
			.list1 label{
				display: inline-block;
				width: 40%;
				font-size: 3.2vw;
			}
			.list1 div{
				flex: 1;
				text-align: right;
				color: #999999;
				font-size: 3.2vw;
			}
			.list1 img{
				width: 5vw;
				height: 5vw;
				margin: 0 2.8vw;
			}
			.list2{
				width: 93%;
				height: 12vw;
				line-height: 12vw;
				border-bottom: 1px solid #f2f2f2;
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;
			}
			.list2>div{
				display: flex;
				flex-direction: row;
				align-items: center;
				display: flex;
				flex-direction: row;
				align-items: center;
			}
			.text{
				width: 93%;
				padding: 1vw 0;
				font-size: 3.2vw;
				color: #FF4443;
			}
			.tjBtn{
				width: 80%;
				background: #1071e2;
				color: white;
				text-align: center;
				padding: 2.8vw 0;
				margin: 6vw 0;
				border-radius: 2vw;
				font-size: 3.2vw;
			}
			.loading{
				position: fixed;
				top: 0;
				right: 0;
				bottom: 0;
				left: 0;
				background: rgba(0,0,0,0.1);
				display: flex;
				justify-content: center;
				align-items: center;
			}
		</style>
	</head>
	<body>
		<div class="main">
			<div class="loading">
				<img src="../imgs/loading-2.gif" >
			</div>
			<div class="titTxt">支付宝商圈助手</div>
			<div class="content">
				<div class="list">
					<label for="company">公司名称</label>
					<input type="text" name="company" id="company" placeholder="请填写公司名称"/>
				</div>
				<div class="list">
					<label for="project">项目名称</label>
					<input type="text" name="project" id="project" placeholder="请填写项目名称"/>
				</div>
				<div class="list">
					<label for="contacts">项目联系人</label>
					<input type="text" name="contacts" id="contacts" placeholder="请填写项目联系人"/>
				</div>
				<div class="list">
					<label for="phone">电话</label>
					<input type="text" name="phone" id="phone" placeholder="请填写电话"/>
				</div>
				<!--<div class="list">
					<label for="mailbox">邮箱</label>
					<input type="text" name="mailbox" id="mailbox" placeholder="请填写邮箱"/>
				</div>
				<div class="list">
					<label for="address">邮寄地址</label>
					<input type="text" name="address" id="address" placeholder="请填写合同及发票邮寄地址"/>
				</div>
				<div class="list">
					<label for="zfbId">支付宝账户</label>
					<input type="text" name="zfbId" id="zfbId" placeholder="请填写支付宝账户"/>
				</div>
				<div class="list1" onclick="document.querySelector('#file3').click()">
					<label for="mailbox">LOGO</label>
					<input style="display: none;" type="file" name="file3" id="file3" />
					<div>不小于500*500px</div>
					<img src="../imgs/customerInfo_icon1.png" >
				</div>-->
				<!-- <div class="list1" onclick="document.querySelector('#file1').click()">
					<label for="mailbox">上传门店积分</label>
					<input style="display: none;" type="file" name="file1" id="file1" />
					<div></div>
					<img src="../imgs/customerInfo_icon1.png" >
				</div> -->
				<!--<div class="list1" onclick="document.querySelector('#file2').click()">
					<label for="mailbox">上传门店积分规则</label>
					<input style="display: none;" type="file" name="file2" id="file2" />
					<div></div>
					<img src="../imgs/customerInfo_icon1.png" >
				</div>-->
				<div class="list2">
					<div style="font-size: 3.2vw;">是否需要打通停车系统</div>
					<div>
						<label for="male1">是</label>
						<input type="radio" name="sex" id="male1" value="1"/>
						<label style="margin-left: 2vw;" for="male2">否</label>
						<input type="radio" name="sex" id="male2" value="0"/>
					</div>
				</div>
				<div class="list2">
					<div style="font-size: 3.2vw;">是否有会员管理系统</div>
					<div>
						<label for="male1">是</label>
						<input type="radio" name="sex1" id="male1" value="1"/>
						<label style="margin-left: 2vw;" for="male2">否</label>
						<input type="radio" name="sex1" id="male2" value="0"/>
					</div>
				</div>
				<div class="list2 list21">
					<div style="font-size: 3.2vw;">是否有更换意愿</div>
					<div>
						<label for="male1">是</label>
						<input type="radio" name="sex2" id="male1" value="1"/>
						<label style="margin-left: 2vw;" for="male2">否</label>
						<input type="radio" name="sex2" id="male2" value="0"/>
					</div>
				</div>
				<!--<div class="text" style="margin-top: 2.2vw;">打款账户：重庆千狐云科技有限公司</div>
				<div class="text">开户行：招商银行股份有限公司重庆分行大坪支行</div>
				<div class="text">账号：123913027710801    打款请备注项目名</div>
				<div class="text">商圈助手费用为：8800元/年，支付宝活动价5800元/年</div>
				<div class="text">开具3%增值税专用发票（现享国家政策税率优惠为1%）</div>-->
				<div class="tjBtn">提交</div>
			</div>
		</div>
		<script src="../js/jq.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/public.js" type="text/javascript" charset="utf-8"></script>
	</body>
	<script type="text/javascript">
		$(function(){
			$('.loading').hide()
			$('.list21').hide()
			// $('#file1').on('click',function(){
			// 	console.log($("#file1").val())
			// 	if($("#file1").val()){
			// 		$(this).siblings('div').html($("#file1").val())
			// 	}
			// 	// var formData = new FormData();
			// 	// formData.append("pic",document.getElementById("file1").files[0]);
			// 	// console.log(formData)
			// })
			var fileUrl1,fileUrl2,fileUrl3
			$("#file1").change(function() {
				//console.log(this.files[0])
				$('.loading').show()
				var files1=this.files[0]
				var fd = new FormData();
				fd.append('file',files1);
				//console.log(files1)
				var that=this
				$.ajax({
				    type: "post",      // 给服务器发送文件是post方法
				    url: url+'/system/common/uploadExcelFile', //url看项目的具体接口
				    data:fd,     //注意此处发送的为formdata对象
				    contentType: false, // 不设置内容类型
				    processData: false, // 不处理数据
				    dataType: "json",   //希望接受的数据类型是json
				    success: function (res) {
				        // 请求成功后要执行的代码
						if(res.code==200){
							//console.log('asd')
							fileUrl1=res.fileUrl
							$(that).siblings('div').html('上传成功')
						}else{
							alert(res.data)
						}
						$('.loading').hide()
				    },
					error: function(err) {
					    alert('上传失败,文件过大')
						$('.loading').hide()
					}
				});
			});
			$("#file2").change(function() {
				$('.loading').show()
				var files2=this.files[0]
				var fd1 = new FormData();
				fd1.append('file',files2);
				//console.log(files1)
				var that=this
				$.ajax({
				    type: "post",      // 给服务器发送文件是post方法
				    url: url+'/system/common/uploadExcelFile', //url看项目的具体接口
				    data:fd1,     //注意此处发送的为formdata对象
				    contentType: false, // 不设置内容类型
				    processData: false, // 不处理数据
				    dataType: "json",   //希望接受的数据类型是json
				    success: function (res) {
				        // 请求成功后要执行的代码
						if(res.code==200){
							//console.log('asd')

							fileUrl2=res.fileUrl
							$(that).siblings('div').html('上传成功')

						}else{
							alert(res.data)
						}
						$('.loading').hide()
				    },
					error: function(err) {
					    alert('上传失败,文件过大')
						$('.loading').hide()
					}
				});
			});
			$("#file3").change(function() {
				$('.loading').show()
				var files3=this.files[0]
				var fd3 = new FormData();
				fd3.append('file',files3);
				//console.log(files1)
				var that=this
				$.ajax({
				    type: "post",      // 给服务器发送文件是post方法
				    url: url+'/system/common/uploadFile', //url看项目的具体接口
				    data:fd3,     //注意此处发送的为formdata对象
				    contentType: false, // 不设置内容类型
				    processData: false, // 不处理数据
				    dataType: "json",   //希望接受的数据类型是json
				    success: function (res) {
				        // 请求成功后要执行的代码
						if(res.code==200){
							//console.log('asd')
							fileUrl3=res.fileUrl
							$(that).siblings('div').html('上传成功')
						}else{
							alert(res.data)
						}
						$('.loading').hide()
				    },
					error: function(err) {
					    alert('上传失败,文件过大')
						$('.loading').hide()
					}
				});
			});

			//单选显示隐藏
			$('input[name="sex1"]').on('click',function(){
				if($('input[name="sex1"]:checked').val()==1){
					$('.list21').show()
				}else{
					$('.list21').hide()
				}
			})
			// if($("#file1").val()){
			// 	$(this).siblings('div').html($("#file1").val())
			// }
			$('.tjBtn').on('click',function(){
				$("input[type='radio']").removeAttr('checked')
				if(!$('#company').val()){
					alert('请填写公司名称')
					return false
				}
				if(!$('#project').val()){
					alert('请填写项目名称')
					return false
				}
				if(!$('#contacts').val()){
					alert('请填写项目联系人')
					return false
				}
				if(!$('#phone').val()){
					alert('请填写电话')
					return false
				}
				if(!$('#mailbox').val()){
					alert('请填写邮箱')
					return false
				}
				if(!$('#address').val()){
					alert('请填写合同及发票邮寄地址')
					return false
				}
				if(!$('#zfbId').val()){
					alert('请填写支付宝账户')
					return false
				}
				console.log(fileUrl3)
				if(!fileUrl3){
					alert('请上传LOGO')
					return false
				}
				// if(!fileUrl1){
				// 	alert('请上传门店积分')
				// 	return false
				// }
				if(!fileUrl2){
					alert('请上传门店积分规则')
					return false
				}
				if($('input[name="sex"]:checked').val() == undefined){
					alert('请选择是否打通停车系统')
					return false
				}
				if($('input[name="sex1"]:checked').val() == undefined){
					alert('请选择是否有会员管理系统')
					return false
				}
				if($('input[name="sex1"]:checked').val() == 1){
					if($('input[name="sex2"]:checked').val() == undefined){
						alert('请选择是否有更换意愿')
						return false
					}
				}
				//console.log($('input[name="sex"]:checked').val())
				var data={}
				data.companyName=$('#company').val() //公司名称
				data.projectName=$('#project').val() //项目名称
				data.username=$('#contacts').val() //商圈联系人
				data.mobile=$('#phone').val() //电话
				data.email=$('#mailbox').val() //邮箱
				data.shippingAddress=$('#address').val() //邮寄地址
				data.aliAccount=$('#zfbId').val() //支付宝账号
				//data.storeIntegralUrl=fileUrl1 //上传门店积分
				data.storeIntegralRuleUrl=fileUrl2 //上传门店积分规则
				data.logoUrl=fileUrl3 //LOGO
				data.isParking=Number($('input[name="sex"]:checked').val()) //是否需要打通停车系统
				data.isUserSystem=Number($('input[name="sex1"]:checked').val()) //是否有会员管理系统
				if($('input[name="sex1"]:checked').val() == 1){
					data.isUpdateWill=Number($('input[name="sex2"]:checked').val()) //是否有更换意愿
				}
				// myAjax('post','/merchant/storeInfo/saveOrUpdate',data,function(res){
				// 	if(res.code==200){

				// 	}else{
				// 		alert(res.data)
				// 	}
				// })
				//console.log(data)
				$.ajax({
				    type: 'post',
				    url: url + '/merchant/storeInfo/saveOrUpdate',
				    data: JSON.stringify(data),
					dataType:"json",
					contentType : 'application/json',
				    success: function(res){
						if(res.code==200){
							alert('提交成功')
							window.location.reload()
						}else{
							alert(res.data)
						}
					}
				});
			})
		})
	</script>
</html>
